<template>
	<view class="title">请选择就诊人</view>
	<view class="box" @click="goselectDep(v)" v-for="v in selPersonData.selPerson">
		<view class="info">
			<view class="name">
				{{ v.name }}
				<text>
					{{
						['本人', '子女', '夫妻', '父母', '朋友'][v.relationType]
					}}
				</text>
			</view>
			<view class="idNum">{{ v.cardNum }}</view>
		</view>
		<view class="type">{{ v.status === 0 ? '默认就诊人' : '' }}</view>
	</view>
</template>

<script setup>
import { doctorSelPer } from '@/api/AppointmentRegisterAPI.js'
import { selPersonStore } from '@/store/appReStore.js'
import { onMounted, computed,ref,reactive } from 'vue'
const selPersonData = reactive({selPerson:[]})
const selPerson = selPersonStore()
// 获取选择就(诊人信息
doctorSelPer(selPerson.id).then(({
		data
	}) => {
		if (data.msg == 'success') {
			selPersonData.selPerson = data.data;
		}
	}).catch((err) => {
		console.log(err);
	})
onMounted(() => {
	// selPerson.selPersonFn()
})
let goselectDep = v => {
	// console.log('goselectDep',v)
	
	selPerson.selPersonData = v
	uni.navigateTo({
		url: '/pages/appointmentRegister/selectDepartment/selectDepartment'
	})
}
</script>

<style lang="less" scoped="">
.title {
	font-size: 30rpx;
	margin: 34rpx 0 26rpx 34rpx;
	color: #131210;
}

.box {
	width: 670rpx;
	height: 270rpx;
	background-color: #f5f9fe;
	border-radius: 6rpx;
	margin: 26rpx 34rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;

	.info {
		margin-left: 30rpx;

		.name {
			font-size: 30rpx;

			text {
				width: 92rpx;
				height: 62rpx;
				border-radius: 31rpx;
				background-color: #e2edfe;
				color: #4d99ff;
				font-size: 24rpx;
				margin-left: 18rpx;
				padding: 0 16rpx;
				margin-bottom: 12rpx;
				text-align: center;
			}
		}

		.idNum {
			font-size: 24rpx;
			color: #cacbcd;
			margin-top: 12rpx;
		}
	}

	.type {
		font-size: 26rpx;
		color: #333;
		margin-right: 34rpx;
	}
}
</style>
